<template>
  <div class="Config">
    <div class="left">
      <Menu mode="vertical" style="width: 200px" :theme="dark" active-name="1"
        ><router-link to="/yonghu" style="color: rgb(83, 83, 83)">
          <MenuItem name="1">
            <div class="menuImg">
              <img
                src="../../../image/yhqx-noActive.svg"
                style="width: 18px; height: 18px"
              />
              <div>
                用户权限
              </div>
            </div>
          </MenuItem>
        </router-link>
        <router-link to="/xiaoxi" style="color: rgb(83, 83, 83)">
          <MenuItem name="2">
            <div class="menuImg">
              <img
                src="../../../image/xxtz-noActive.svg"
                style="width: 18px; height: 18px"
              />
              <div>
                消息通知
              </div>
            </div>
          </MenuItem>
        </router-link>
        <router-link to="/xitong" style="color: rgb(83, 83, 83)">
          <MenuItem name="3">
            <div class="menuImg">
              <img
                src="../../../image/ywcs-noActive.svg"
                style="width: 18px; height: 18px"
              />
              <div>
                系统参数
              </div>
            </div>
          </MenuItem>
        </router-link>
        <router-link to="/yewu" style="color: rgb(83, 83, 83)">
          <MenuItem name="4">
            <div class="menuImg">
              <img
                src="../../../image/ywgk-noActive.svg"
                style="width: 18px; height: 18px"
              />
              <div>
                业务管控
              </div>
            </div>
          </MenuItem>
        </router-link>
        <router-link to="/jicheng" style="color: rgb(83, 83, 83)">
          <MenuItem name="5">
            <div class="menuImg">
              <img
                src="../../../image/jcsb-noActive.svg"
                style="width: 18px; height: 18px"
              />
              <div>
                集成设备
              </div>
            </div>
          </MenuItem>
        </router-link>
        <router-link to="/rizhi" style="color: rgb(83, 83, 83)">
          <MenuItem name="6">
            <div class="menuImg">
              <img
                src="../../../image/rzsj-noActive.svg"
                style="width: 18px; height: 18px"
              />
              <div>
                日志审计
              </div>
            </div>
          </MenuItem>
        </router-link>
      </Menu>
    </div>

    <div class="right">
      <router-view />
    </div>
  </div>
</template>
  
  <script>
export default {
  data() {
    return {};
  },
};
</script>
  
  <style scoped>
.Config {
  display: flex;
  height: 100vh;
  color: #000;
}

.left {
  background-color: #fff;
  border-right: 1px solid #dddddd;
}
.right {
  width: 100%;
}
.menuImg{
  display: flex;

  align-items: center;
}
.menuImg div{
  padding-left: 5px ;
}
.ivu-menu-light.ivu-menu-vertical .ivu-menu-item-active:not(.ivu-menu-submenu){
  background-color: #f9f5f3;  
 }
</style>